<template>
	<a-modal
		:title="title"
		:width="modalWidth"
		:bodyStyle="bodyStyle"
		:visible="visible"
		:confirmLoading="confirmLoading"
		@ok="handleOk"
		@cancel="handleCancel"
		:destroyOnClose="true"
		:maskClosable="false"
	>
		<a-spin :spinning="confirmLoading">
			<a-form :form="form" autocomplete="off" :labelCol="labelCol" :wrapperCol="wrapperCol">
				
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="编码">
					<a-input
						placeholder="编码"
						v-decorator="[
							'code',
							{
								rules: [{ required: true, whitespace: true, message: '请输入编码' }],
								trigger: 'blur'
							}
						]"
					/>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="名称">
					<a-input
						placeholder="名称"
						v-decorator="[
							'name',
							{
								rules: [{ required: true, whitespace: true, message: '请输入名称' }],
								trigger: 'blur'
							}
						]"
					/>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="介绍">
					<a-textarea class="w100" :auto-size="{ minRows: 3, maxRows: 5 }" placeholder="介绍" v-decorator="['description',
					{
						rules: [{ required: true, whitespace: true, message: '请输入介绍' }],
						trigger: 'blur'
					}]" />
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="链接">
					<a-input
						placeholder="链接"
						v-decorator="[
							'wshopLink',
							{
								rules: [{ required: true, whitespace: true, message: '请输入链接' }],
								trigger: 'blur'
							}
						]"
					/>
				</a-form-item>
				
			</a-form>
		</a-spin>
	</a-modal>
</template>

<script>
import { api } from '@/api/index.js';
import { ModalMixins } from '@/mixins';
function getBase64(file) {
	return new Promise((resolve, reject) => {
		const reader = new FileReader();
		reader.readAsDataURL(file);
		reader.onload = () => resolve(reader.result);
		reader.onerror = error => reject(error);
	});
}
export default {
	name: 'addNationalLineModal',
	mixins: [ModalMixins],
	data() {
		return {
			confirmDirty: false,
			nalitionalTypeList: [{"code":"line_A","name":"国家线A线"},{"code":"line_B","name":"国家线B线"}],
			majorList: [],
			uploadFile: process.env.VUE_APP_API_BASE_URL + api.uploadFile,
			headers: {
				'X-AUTH-TOKEN': 'Basic ' + window.localStorage.getItem('token')
			}
		};
	},
	created() {},
	methods: {
		add(record) {
			this.visible = true;
			if (this.majorList.length == 0) {
				this.getAreasOrMajor('major');
			}
			if (record) {
				this.title = '编辑推荐课程';
				this.isAdd = false;
				this.mdl = { ...record };
				this.init();
			} else {
				this.title = '新增推荐课程';
				this.isAdd = true;
			}
		},
		init() {
			this.$nextTick(() => {
				this.form.setFieldsValue(
					this.$pick(this.mdl, 'id', 'code', 'name', 'description', 'wshopLink')
				);
			});
		},
		close() {
			this.$emit('close');
			this.visible = false;
		},
		handleOk() {
			const _this = this;
			// 触发表单验证
			this.form.validateFields((err, values) => {
				// 验证表单没错误
				if (!err) {
					let { scoresAnalysis } = values;
					let parameter = { ...values };
					if (scoresAnalysis && scoresAnalysis.length > 0) {
						let picList = scoresAnalysis.map(item => item.url.replace(process.env.VUE_APP_API_BASE_URL, ''));
						parameter.scoresAnalysis = picList.join(';');
					}
					console.log('parameter', parameter);
					_this.confirmLoading = true;
					this.$postAction(api.saveOrUpdateCourse, Object.assign(parameter, !this.isAdd ? { id: this.mdl.id } : null))
						.then(res => {
							if (res.code == 200) {
								_this.$message.success('保存成功');
								_this.$emit('ok');
								_this.form.resetFields();
								_this.visible = false;
							}
						})
						.finally(() => {
							_this.confirmLoading = false;
						});
				}
			});
		},
		handleCancel() {
			this.close();
		},
		normPicListFile(e) {
			if (Array.isArray(e)) {
				return e;
			}
			if (e && e.fileList) {
				e.fileList.forEach(item => {
					let fileUrl = item.response && item.response.data ? item.response.data : null;
					if (!item.url && fileUrl) {
						item.url = fileUrl;
					}
				});
			}
			return e && e.fileList;
		},
		getAreasOrMajor(optiontype) {
			this.$getAction(this.$api.getAreasOrMajor, {
				optiontype
			}).then(da => {
				let list = [...da.data];
				if (optiontype == 'area') {
					this.areaList = list;
				} else {
					this.majorList = list;
				}
			});
		}
	}
};
</script>

<style scoped></style>
